// OEM 配置管理工具

export interface OEMConfig {
  title: string;
  packageName: string;
  cdnDomain: string;
  apiDomain: string;
  socketDomain: string;
  serviceApiDomain: string;
  editorDomain: string;
  logoMini?: {
    url: string;
    width?: string;
    height?: string;
  };
  logoLogin?: {
    url: string;
    width?: string;
    height?: string;
    title?: string;
    description?: string;
  };
  logoMiniProjects?: {
    url: string;
    width?: string;
    height?: string;
  };
  loginTypes?: Array<'scan' | 'sms_code' | 'password'>;
}

// 默认 Appthen 配置
export const defaultOEMConfig: OEMConfig = {
  title: 'Appthen Studio',
  packageName: 'appthen-studio',
  cdnDomain: 'cdn.appthen.com',
  apiDomain: 'https://editor.appthen.com',
  socketDomain: 'wss://editor.appthen.com',
  serviceApiDomain: 'https://www.appthen.com',
  editorDomain: 'editor.appthen.com',
  /* 从此开始 */
  // logoMini: {
  //   url: 'https://cdn.appthen.com/editor/oem/light_logo_2.png',
  //   width: '146px',
  //   height: '40px',
  // },
  // logoLogin: {
  //   url: 'https://cdn.appthen.com/editor/oem/dark_logo_2.png',
  //   width: '146px',
  //   height: '40px',
  //   title: '工业数字化一站式底座',
  //   description:
  //     '内置数据接入、实时计算、可视化、低代码开发与 PHM 预测模型。一条流水线完成数据大屏、企业级系统与工业应用的构建、调试和上线，让团队专注业务创新',
  // },
  // logoMiniProjects: {
  //   // url: '	https://cdn.appthen.com/Fit41RrDymDZsZ8zOTgyGClitH4N',
  //   // width: '122px',
  //   // height: '24px',
  //   url: 'https://cdn.appthen.com/editor/oem/light_logo_2.png',
  //   width: '146px',
  //   height: '40px',
  // },
  // loginTypes: ['password'],
  loginTypes: ['sms_code', 'scan', 'password'],
};

// 声明全局类型
declare global {
  interface Window {
    // @ts-ignore
    OEM_CONFIG?: OEMConfig;
  }
}

/**
 * 获取 OEM 配置，如果没有则使用默认配置
 */
export const getOEMConfig = (): OEMConfig => {
  // 检查是否在浏览器环境中
  if (typeof window !== 'undefined' && window.OEM_CONFIG) {
    return window.OEM_CONFIG;
  }
  // 服务端环境或客户端未设置配置时，使用默认配置
  return defaultOEMConfig;
};

/**
 * 设置 OEM 配置
 */
export const setOEMConfig = (config: Partial<OEMConfig>): void => {
  // 只在浏览器环境中设置配置
  if (typeof window !== 'undefined') {
    window.OEM_CONFIG = {
      ...defaultOEMConfig,
      ...config,
    };
  }
};

/**
 * 初始化 OEM 配置
 * 这个函数会在应用启动时调用，用于设置默认配置
 */
export const initOEMConfig = (): void => {
  // 只在浏览器环境中初始化配置
  if (typeof window !== 'undefined' && !window.OEM_CONFIG) {
    window.OEM_CONFIG = defaultOEMConfig;
  }
};

/**
 * 动态更新 CSS 中的 CDN 域名
 * 由于 CSS 文件无法直接使用 JavaScript 变量，需要在运行时动态替换
 */
export const updateCSSCdnDomain = (): void => {
  // 只在浏览器环境中执行
  if (typeof window === 'undefined' || typeof document === 'undefined') {
    return;
  }

  const config = getOEMConfig();
  const styleSheets = document.styleSheets;

  for (let i = 0; i < styleSheets.length; i++) {
    try {
      const styleSheet = styleSheets[i];
      if (styleSheet.href && styleSheet.href.includes('app.css')) {
        // 这里可以添加动态替换 CSS 中 CDN 域名的逻辑
        // 由于浏览器安全限制，直接修改 CSS 规则比较复杂
        // 建议在构建时或服务器端进行替换
        console.log('Found app.css, CDN domain should be replaced during build time');
      }
    } catch (e) {
      // 跨域样式表无法访问，忽略错误
      console.warn('Cannot access stylesheet:', e);
    }
  }
};

/**
 * 生成用于 HTML 注入的 OEM 配置脚本
 * 这个函数用于在 Docker 部署时生成配置脚本
 */
export const generateOEMConfigScript = (config: Partial<OEMConfig>): string => {
  const finalConfig = {
    ...defaultOEMConfig,
    ...config,
  };

  return `
<script>
  window.OEM_CONFIG = ${JSON.stringify(finalConfig, null, 2)};
</script>
  `.trim();
};

/**
 * 用于 Docker 部署的配置模板
 * 在构建时，这些占位符会被实际的配置值替换
 */
export const oemConfigTemplate = `
<script>
  window.OEM_CONFIG = {
    title: '{{OEM_TITLE}}',
    packageName: '{{OEM_PACKAGE_NAME}}',
    cdnDomain: '{{OEM_CDN_DOMAIN}}',
    apiDomain: '{{OEM_API_DOMAIN}}',
    socketDomain: '{{OEM_SOCKET_DOMAIN}}',
    serviceApiDomain: '{{OEM_SERVICE_API_DOMAIN}}',
    editorDomain: '{{OEM_EDITOR_DOMAIN}}'
  };
</script>
`;
